import React, {Component} from 'react';
import '../css/successfuleCase.css';
import {Consumer} from "../store";
import {project} from "../value";
import app from '../appMethod';
import {config} from "../config";
import $ from "jquery";

class SuccessfulCase extends Component {
    constructor(props) {
        super(props);
        this.state = {
            data:[]
        };
    }

    render() {
        return (
            <div style={{overflow: 'hidden'}}>
                <div className="successfulCaseHeader">
                </div>
                <div className="caseListContainer">
                    <div className="normalContainer">
                        <div className={"caseList active"}>
                            {
                                this.state.data.map((item,index)=>{
                                    return(
                                        <div className="caseListItem" key={index} onClick={()=>this.handleRedirect(item.project_id)}>
                                            <div className="caseListItemLogo">
                                                <img src={config.imgServerUrl+item.project_picture} alt={''}/>
                                            </div>
                                            <div className="caseListItemName">{item.project_name}</div>
                                        </div>
                                    )
                                })
                            }
                        </div>
                    </div>
                </div>
            </div>
        )
    };

    componentDidMount() {
        const {dispatch} =this.props;
        dispatch({num:3});
        $(document).scrollTop(0);
        this.searchProject({});
    };

    componentWillUnmount() {
        this.setState = (count, callback) => {
            return;
        }
    }

    /**
     * 查找项目列表
     * @param param
     */
    searchProject(param) {
        let _this = this;
        _this.setState({loading: true});
        app.post(project.SEARCH_PROJECT, param).then(result => {
            if (result.code === 1) {
                const data=result.data;
                this.setState({data: data, loading: false });
            } else {
                app.alert(result.msg, 'success', 2);
                this.setState({ data: [], loading: false});
            }
        });
    }

    /**
     * 处理跳转详情页事件
     * @param num
     */
    handleRedirect(project_id){
        this.props.history.push(config.path+`/index/successfulCaseDetail/${project_id}`);
    }
}


export default prop=>(
    <Consumer>
        {
            props=>(
                <SuccessfulCase {...props} {...prop}/>
            )
        }
    </Consumer>
)
//export default SuccessfulCase;